<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>赠送优惠券</title>
    <!-- <script>
        var NotcheckLogin = 1;
    </script> -->
    <link rel="stylesheet" href="./assets/css/mdui.min.css">
    <script src="./assets/js/mdui.min.js"></script>
    <script src="./assets/js/config.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <style>
            #con2 img{
                width:2rem;
            }
            #bg{
                background:url(./assets/img/share_bg.png);
                background-size: 100% auto;
                width: 100%;
                height:15rem;
            }

            #bg .title{
                color:#fff;
                font-size:1.5rem;
                text-align: center;
                margin-top:1rem;

            }
            #con2{
                padding:1rem
            }
            #share{
                background:url(./assets/img/share.png) no-repeat center top;
                background-size: 80% auto;
                background-position:center center;
               margin-top:1rem;
                height:8rem;
                position:relative
            }
            #logo{
                height: 2rem;
            }
            #lingquan{
                position: absolute;
                top:40%;
                left:63%;
                color:#fff;
                font-size:1.3rem;
            }
            #times{
                position: absolute;
                top:35%;
                left:28%;
                color:#d0021b;
                font-size:2rem;
            }
            .price{
                color:#f40;
                font-size:2rem;
            }
            .imgs{
                width:100% !important;
                height:5rem;
            }
            .card{
                padding:0.5rem;
            }
            .card .title{
                font-size:1rem;
            }
            /* .card .prices{
                float
            } */
            .price_div{
                position: absolute;
                bottom:-360%;
                width:100%            }
            #send{
                width:100%;
                height:100%;
                background-color:rgba(0,0,0,0.8);
                position: fixed;
                display: none;
                top:0;
     
            }
            #send #text{
                color:#fff;
                margin-top:11rem;
                font-size:1.5rem;
                text-align: center;
            }
    </style>
<body>

    <div id="bg" >
        <div id="logo"></div>
        <div class="title">分享优惠券</div>
        <div onclick="share()" id="share">
            <span  id="lingquan">立刻分享</span>
            <span id="times">  </span>
        </div>
    </div>
    <div id="con2">
        <div v-for="item in ticket_list" class=" mdui-shadow-2 card">
            <div class="mdui-container">
                <div class="mdui-col-xs-3" style="padding:0">
                    <img :src="item.t_coupon_image" class="imgs" alt="">
                </div>
                <div class="prices mdui-col-xs-9">
                    <div class="title">{{item.t_coupon_name}}</div>
                    <div class="price_div"> ￥<span class="price"> {{item.f_price}}</span>   <span style="float:right;font-size:25px;" class=""> {{item.f_qty}} 张</span> </div>
                </div>
            </div>
        </div> 
    </div>

    <button style="width:100%" onclick="share()" class="mdui-btn mdui-btn-block mdui-color-theme-accent mdui-color-red mdui-ripple">立刻分享</button>
    <div id="send"> 
        <img style="float:right" src="./assets/img/jiantou.png" alt="">
        <div id="text">点击发送给好友即可分享</div>
    </div>
</body>
</html>
<script>

        var ticket_list = new Vue({
            el:'#con2',
            data:{
                ticket_list:{},
                num:1
            }
        })
        $.post(domain+'/api/client/ticketInfo',{t_id:$_GET().id},function(data){
            console.log(data);
            ticket_list.ticket_list = data.data;
            
            bg.data = data.ticket_data;
            $("#times").html(data.allnum+'张')
            $("body").attr('titles',data.ticket_data.t_ticket_name)
            
        },'json')
        
        function share(){
            $("#send").show();
        }
        $("#send").on('click',function(){
            $("#send").hide();
        })
        $.post(domain+"/getWxconfig.php",{'url':window.location.href},function(data){
            console.log(data);
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: data.appId,
                timestamp: data.timestamp, // 必填，生成签名的时间戳
                nonceStr: data.nonceStr, // 必填，生成签名的随机串
                signature: data.signature,// 必填，签名
                jsApiList: ['updateAppMessageShareData','onMenuShareAppMessage'] // 必填，需要使用的JS接口列表
            });
        },'json')

        wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
          
          wx.onMenuShareAppMessage({
            title:    $("body").attr('titles'), // 分享标题
            desc: '赶快点击我领取吧', // 分享描述
            link: 'http://'+window.location.host+'/web/get.html?id='+$_GET().id+'&item_id='+$_GET().t_item_id+'&uid='+getCookie('uid'), // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: 'http://'+window.location.host+'/web/assets/img/quan.jpg', // 分享图标
            success: function () {
            // 用户点击了分享后执行的回调函数
            }
           });
          
          
            wx.updateAppMessageShareData({ 
                title:  $("body").attr('titles'), // 分享标题
                desc: '赶快点击我领取吧', // 分享描述
                link: 'http://'+window.location.host+'/web/get.html?id='+$_GET().id+'&item_id='+$_GET().t_item_id+'&uid='+getCookie('uid'), // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                imgUrl: 'http://'+window.location.host+'/web/assets/img/quan.jpg', // 分享图标
                success: function () {
                // 设置成功
                }
            })
        });
       
</script>
